<!DOCTYPE html>
<html>
<head>
    <title>Excel File Upload and Read Example</title>
    <script src="https://unpkg.com/xlsx/dist/xlsx.full.min.js"></script>
</head>
<body>
    <h1>Excel File Upload and Read Example</h1>
    <input type="file" id="excelFileInput" accept=".xlsx">
    <button onclick="readExcelFile()">Read File</button>
    <div id="excelData"></div>

    <script>
        function readExcelFile() {
            var fileInput = document.getElementById('excelFileInput');
            var file = fileInput.files[0];
            var reader = new FileReader();

            reader.onload = function(e) {
                var data = new Uint8Array(e.target.result);
                var workbook = XLSX.read(data, { type: 'array' });

                var sheetName = workbook.SheetNames[0];
                var worksheet = workbook.Sheets[sheetName];

                var excelData = XLSX.utils.sheet_to_json(worksheet, { header: 1 });

                var html = '<table>';
                for (var i = 0; i < excelData.length; i++) {
                    html += '<tr>';
                    for (var j = 0; j < excelData[i].length; j++) {
                        html += '<td>' + excelData[i][j] + '</td>';
                    }
                    html += '</tr>';
                }
                html += '</table>';

                document.getElementById('excelData').innerHTML = html;
            };

            reader.readAsArrayBuffer(file);
        }
    </script>
</body>
</html>
